<template>
  <div class="inspector-info-box">
    <div class="inspector-row">
      <div class="inspector-label">检查人员</div>
      <div class="inspector-value">{{userInfo.userName}}</div>
      <div class="inspector-label">检查时间</div>
      <div class="inspector-value">{{userInfo.time}}</div>
    </div>
  </div>
</template>

<script setup lang="ts">
const today = new Date()
const year = today.getFullYear();
const month = String(today.getMonth() + 1).padStart(2, '0');
const day = String(today.getDate()).padStart(2, '0');
const hours = String(today.getHours()).padStart(2, '0');
const minutes = String(today.getMinutes()).padStart(2, '0');
const seconds = String(today.getSeconds()).padStart(2, '0');

const userInfo = ref<any>( {
    userName: getUserInfo().empName,
    time: `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`,
})
</script>

<style scoped>
.inspector-info-box {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 8px 0 #e9e9e9;
  padding: 0 0 0 0;
  margin: 0;
  overflow: hidden;
}
.inspector-row {
  display: flex;
  align-items: center;
  padding: 0 24px;
  height: 48px;
  font-size: 15px;
  color: #666;
}
.inspector-label {
  color: #999;
  min-width: 80px;
  text-align: left;
  margin-right: 8px;
}
.inspector-value {
  color: #222;
  min-width: 120px;
  margin-right: 48px;
}
</style>
